From: Florian Müllner Date: Thu, 1 Jun 2017 14:11:56 +0000 (+0200) Subject: workspace: Only reveal title captions on hover X-Git-Tag: archive/raspbian/50.5-1+rpi1~1^2~1013^2^2~162 X-Git-Url: https://dgit.raspbian.org/%22http://www.example.com/cgi/%22/%22http:/www.example.com/cgi/%22?a=commitdiff_plain;h=4fd5eee2c6a9b4e63e873f5e714cd1bd848d85e9;p=gnome-shell.git workspace: Only reveal title captions on hover While the new title position gives the previews more space, they now overlay the content which may hide valuable information. Address this by only revealing the title as additional information on hover, like we do for other auxiliary elements. https://bugzilla.gnome.org/show_bug.cgi?id=783953 --- diff --git a/data/theme/gnome-shell-high-contrast.css b/data/theme/gnome-shell-high-contrast.css index e43b9c093..442a7f379 100644 --- a/data/theme/gnome-shell-high-contrast.css +++ b/data/theme/gnome-shell-high-contrast.css @@ -1107,13 +1107,10 @@ StScrollBar { .window-caption { spacing: 25px; - color: #eeeeec; - background-color: rgba(46, 52, 54, 0.7); + color: #ffffff; + background-color: #215d9c; border-radius: 8px; padding: 4px 12px; } - .window-caption:hover { - background-color: #215d9c; - color: #ffffff; } .search-entry { width: 320px; diff --git a/data/theme/gnome-shell-sass b/data/theme/gnome-shell-sass index b178ba1d9..3ce23ca96 160000 --- a/data/theme/gnome-shell-sass +++ b/data/theme/gnome-shell-sass @@ -1 +1 @@ -Subproject commit b178ba1d9d090e269b898952fd5a79c54ddc6f75 +Subproject commit 3ce23ca9648c131a33b79f37b3e19001ff45450d diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css index c57fae711..3c753bfc3 100644 --- a/data/theme/gnome-shell.css +++ b/data/theme/gnome-shell.css @@ -1107,13 +1107,10 @@ StScrollBar { .window-caption { spacing: 25px; - color: #eeeeec; - background-color: rgba(46, 52, 54, 0.7); + color: #ffffff; + background-color: #215d9c; border-radius: 8px; padding: 4px 12px; } - .window-caption:hover { - background-color: #215d9c; - color: #ffffff; } .search-entry { width: 320px; diff --git a/js/ui/workspace.js b/js/ui/workspace.js index a1b565b78..7399a6e1c 100644 --- a/js/ui/workspace.js +++ b/js/ui/workspace.js @@ -466,6 +466,7 @@ var WindowOverlay = new Lang.Class({ this._windowAddedId = 0; button.hide(); + title.hide(); this.title = title; this.closeButton = button; @@ -490,7 +491,6 @@ var WindowOverlay = new Lang.Class({ hide: function() { this._hidden = true; - this.title.hide(); this.hideCloseButton(); }, @@ -498,7 +498,6 @@ var WindowOverlay = new Lang.Class({ show: function() { this._hidden = false; - this.title.show(); if (this._windowClone.actor['has-pointer']) this._animateVisible(); }, @@ -639,39 +638,28 @@ var WindowOverlay = new Lang.Class({ _animateVisible: function() { this._parentActor.raise_top(); - if (this._windowCanClose()) { - this.closeButton.show(); - this.closeButton.opacity = 0; - Tweener.addTween(this.closeButton, + let toAnimate = [this.border, this.title]; + if (this._windowCanClose()) + toAnimate.push(this.closeButton); + + toAnimate.forEach(a => { + a.show(); + a.opacity = 0; + Tweener.addTween(a, { opacity: 255, time: CLOSE_BUTTON_FADE_TIME, transition: 'easeOutQuad' }); - } - - this.border.show(); - this.border.opacity = 0; - Tweener.addTween(this.border, - { opacity: 255, - time: CLOSE_BUTTON_FADE_TIME, - transition: 'easeOutQuad' }); - - this.title.add_style_pseudo_class('hover'); + }); }, _animateInvisible: function() { - this.closeButton.opacity = 255; - Tweener.addTween(this.closeButton, - { opacity: 0, - time: CLOSE_BUTTON_FADE_TIME, - transition: 'easeInQuad' }); - - this.border.opacity = 255; - Tweener.addTween(this.border, - { opacity: 0, - time: CLOSE_BUTTON_FADE_TIME, - transition: 'easeInQuad' }); - - this.title.remove_style_pseudo_class('hover'); + [this.closeButton, this.border, this.title].forEach(a => { + a.opacity = 255; + Tweener.addTween(a, + { opacity: 0, + time: CLOSE_BUTTON_FADE_TIME, + transition: 'easeInQuad' }); + }); }, _onEnter: function() { @@ -712,7 +700,7 @@ var WindowOverlay = new Lang.Class({ } this.closeButton.hide(); this.border.hide(); - this.title.remove_style_pseudo_class('hover'); + this.title.hide(); }, _onStyleChanged: function() {